<!--
 * @Author: XieQiu 雪球
 * @Date: 2021-05-09 09:20:38
 * @LastEditTime: 2023-07-10 13:26:56
 * @LastEditors: Please set LastEditors
 * @Description: 承租户信息管理
-->
<template>
  <BaseMainSlot :show-tab="true">
    <template v-slot:btn-box>
      <ActionBar
        :page-no="132"
        :add-active="addActive"
        :del-active="delActive"
        :edit-active="editActive"
        :cancel-active="cancelActive"
        :has-save="false"
        :has-edit="false"
        @add="add"
        @cancel="cancel"
        @edit="edit"
        @del="del"
        @save="save"
      />
    </template>
    <template v-slot:search-box>
      <SearchForm :formConfig="formConfig" :formData="searchlist" @search="search"></SearchForm>
      <!-- <SearchBox @search="search">
        <div class="common-search-item">
          <div class="label">承租户姓名:</div>
          <div class="input">
            <el-input v-model="lesseeName" placeholder="请输入承租户姓名" clearable />
          </div>
        </div>
      </SearchBox> -->
    </template>
    <template v-slot:table-box>
      <el-table
        ref="tableData"
        v-loading="loading"
        highlight-current-row
        :data="tableData"
        stripe
        border
        height="88%"
        :row-key="getRowKey"
        @row-click="handleEdit"
        @selection-change="handleSelectionChange"
      >
        <el-table-column type="selection" :reserve-selection="true" width="55" />
        <el-table-column type="index" width="55" label="序号" />
        <el-table-column prop="lesseeName" label="姓名" />
        <el-table-column
          prop="person.phone"
          min-width="100"
          label="手机号"
          :formatter="formatter"
        />
        <el-table-column prop="leasedPlotsTotalArea" label="承租总面积">
          <template
            v-if="scope.row.lesseeName"
            slot-scope="scope"
          >{{ scope.row.leasedPlotsTotalArea }} 亩</template>
        </el-table-column>
        <el-table-column prop="mainPlantVariety" label="主要种养品种" />
        <el-table-column width="200" label="操作">
          <template v-if="scope.row.lesseeNo" slot-scope="scope">
            <el-button
              v-if="judgePermission(132, 'edit')"
              class="text-btn-cursor"
              type="text"
              size="small"
              @click="edit"
            >
              <i class="el-icon-edit-outline"></i> 修改
            </el-button>
            <el-button
              v-if="judgePermission(132, 'delete')"
              class="text-btn-cursor cursor-delete"
              type="text"
              size="small"
              @click="handleDelete(scope.row.lesseeNo)"
            >
              <i class="el-icon-delete"></i> 删除
            </el-button>
          </template>
        </el-table-column>
      </el-table>
      <Pagination
        :page-size="pageSize"
        :current-page="currentPage"
        :total-size="totalSize"
        @changePageSize="changePageSize"
        @changeCurrentPage="changeCurrentPage"
      />
    </template>
    <template v-slot:dialog>
      <!-- 展示图片 -->
      <el-dialog
        :title="titleText + '承租户'"
        :visible.sync="dialogFormVisible"
        :before-close="cancel"
        width="30%"
      >
        <el-form
          ref="formData"
          label-position="left"
          :model="formData"
          :rules="rules"
          class="el-form"
        >
          <el-form-item
            v-if="nowChanceStau==='add'"
            label="员工:"
            prop="personObj"
            class="w50p"
          >
            <el-select
              v-model="formData.personObj"
              value-key="personNo"
              clearable
              filterable
              @change="person"
            >
              <el-option
                v-for="item in staffData"
                :key="item.personNo"
                :label="item.person.name"
                :value="item"
              />
            </el-select>
          </el-form-item>
          <el-form-item
            v-if="nowChanceStau === 'add'"
            label="承租户姓名:"
            prop="lesseeName"
            class="w50p"
          >
            <el-input
              v-model="formData.lesseeName"
              :disabled="formData.personNo"
              placeholder="请输入承租户姓名"
              clearable
            />
          </el-form-item>
          <el-form-item
            v-if="nowChanceStau === 'edit'"
            label="承租户姓名:"
            prop="lesseeName"
            class="w50p"
          >
            <el-input
              v-model="formData.lesseeName"
              placeholder="请输入承租户姓名"
              clearable
            />
          </el-form-item>
          <el-form-item
            v-if="!formData.personNo&&nowChanceStau==='add' || nowChanceStau === 'edit'"
            label="身份证号:"
            prop="identificationNumber"
            class="w50p"
          >
            <el-input
              v-model="List.identificationNumber"
              placeholder="请输入身份证号"
              clearable
              @input="tuominSave('identificationNumber')"
            />
            <!--
                @blur="tuominChange('identificationNumber')"
            @focus="tuominFocus('identificationNumber')"-->
            <el-input
              v-model="formData.identificationNumber"
              style="display:none"
            />
          </el-form-item>
          <el-form-item label="承租地块数:" prop="leasedPlotsCount" class="w50p">
            <el-input
              v-model="formData.leasedPlotsCount"
              placeholder="请输入承租地块数"
            />
          </el-form-item>
          <el-form-item
            label="承租总面积:"
            prop="leasedPlotsTotalArea"
            class="w50p totalRentedArea"
          >
            <el-input
              v-model="formData.leasedPlotsTotalArea"
              placeholder="请输入承租总面积(亩)"
            >
              <!-- <template slot="append">
                <el-form-item label="单位" prop="unitName" class="w50p">
                  <el-select
                    v-model="formData.unitName"
                    placeholder="请选择"
                    clearable
                    filterable
                  >
                    <el-option label="亩" value="亩" />
                    <el-option label="㎡" value="㎡" />
                  </el-select>
                </el-form-item>
              </template>-->
            </el-input>
          </el-form-item>
          <el-form-item
            label="主要种养品种:"
            prop="mainPlantVariety"
            class="w50p dfs"
          >
            <el-input
              v-model="formData.mainPlantVariety"
              placeholder="请输入种养品种"
            />
          </el-form-item>
          <el-form-item
            v-if="!formData.personNo"
            label="性别:"
            prop="gender"
            class="w50p"
          >
            <el-select v-model="formData.gender" filterable clearable>
              <el-option label="男" value="男" />
              <el-option label="女" value="女" />
              <!-- <el-option label="无" value="无" /> -->
            </el-select>
          </el-form-item>
          <el-form-item
            v-if="!formData.personNo&&nowChanceStau==='add' || nowChanceStau === 'edit'"
            label="手机号:"
            prop="phone"
            class="w50p"
          >
            <el-input
              v-model="List.phone"
              placeholder="请输入手机号"
              clearable
              @input="tuominSave('phone')"
            />
            <el-input
              v-model="formData.phone"
              placeholder="请输入手机号"
              clearable
              style="display:none"
            />
          </el-form-item>
          <el-form-item
            v-if="!formData.personNo&&nowChanceStau==='add' || nowChanceStau === 'edit'"
            label="座机号:"
            prop="landline"
            class="w50p"
          >
            <el-input
              v-model="formData.landline"
              placeholder="请输入座机号"
              clearable
            />
          </el-form-item>

          <el-form-item
            v-if="!formData.personNo&&nowChanceStau==='add' || nowChanceStau === 'edit'"
            label="邮箱:"
            prop="email"
            class="w50p"
          >
            <el-input
              v-model="formData.email"
              type="email"
              placeholder="请输入邮箱"
              clearable
            />
          </el-form-item>
          <el-form-item
            v-if="!formData.personNo&&nowChanceStau==='add' || nowChanceStau === 'edit'"
            label="微信:"
            prop="weChat"
            class="w50p"
          >
            <el-input v-model="formData.weChat" placeholder="请输入微信" clearable />
          </el-form-item>
          <el-form-item
            v-if="!formData.personNo&&nowChanceStau==='add' || nowChanceStau === 'edit'"
            label="住址:"
            prop="address"
            class="w50p"
          >
            <el-input v-model="formData.address" placeholder="请输入住址" clearable />
          </el-form-item>
          <el-form-item
            v-if="!formData.personNo&&nowChanceStau==='add' || nowChanceStau === 'edit'"
            label="生日:"
            prop="birthday"
            class="w50p"
          >
            <el-date-picker
              v-model="formData.birthday"
              type="date"
              value-format="yyyy-MM-dd"
              placeholder="请选择生日日期"
              clearable
              filterable
            />
          </el-form-item>
          <!-- <el-form-item label="身份证正面:" class="w50p">
            <Loadimages
              :can-input="!canInput"
              :post-url="idCardInImgUrl"
              :title="'正面'"
              @child-event="idCardInImg"
              @ika-img="idCardInImgName"
            />
          </el-form-item>
          <el-form-item label="身份证反面:" class="w50p">
            <Uploadimage
              :can-input="!canInput"
              :post-url="idCardOutImgUrl"
              :title="'反面'"
              @child-event="idCardOutImg"
              @ika-img="idCardOutImgName"
            />
          </el-form-item>

          <el-form-item label="承租合同:" class="w50p">
            <MultipleUpimage
              :can-input="!canInput"
              :img-url-list="relList"
              @child-event="contractImg"
            />
          </el-form-item>-->
        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button class="zh-button-one" @click="cancel('formData')">取 消</el-button>
          <el-button
            class="zh-button-two"
            type="primary"
            @click="save('formData')"
          >保 存</el-button>
        </div>
      </el-dialog>
    </template>
  </BaseMainSlot>
</template>

<script>
import SearchForm from '@/components/searchForm';
import ActionBar from "@/components/ActionBar";
import Pagination from "@/components/Pagination";
import BaseMainSlot from "@/components/BaseMainSlot/newBaseMainSlot";
// import Uploadimage from "@/components/uploadimage/uploadimage.vue";
// import Loadimages from "@/components/uploadimage/loadimages.vue";
import tenantInfoManage from "@/api/digital-operation/tenant-manage/tenant-info";
import staffManage from "@/api/digital-operation/personnel-cost-mansge/staff-manage";
// import basicInfoManage from "@/api/digital-operation/personnel-cost-mansge/staff-manage";
// import basicInfoManage from "@/api/basic-info-manage/pasnting-category-manage";
// import MultipleUpimage from "@/components/uploadimage/MultipleUploadimage.vue";
import { mymixin } from "@/utils/mixins";
import { desensitizedPhone, desensitizedIdNo } from "@/utils/desensitized";
// import baseQuery from "@/api/digital-operation/base";
import { mapGetters } from "vuex";

export default {
  name: "TenantInfo",
  components: {
    SearchForm,
    ActionBar,
    // Uploadimage,
    // Loadimages,
    // MultipleUpimage,
    Pagination,
    BaseMainSlot,
  },
  mixins: [mymixin],
  data() {
    // var checkIdentitytionId = (rule, value, callback) => {
    //   if (!value) {
    //     return callback(new Error("身份证号不能为空"));
    //   }
    //   if (!/(^\d{15}$)|(^\d{17}(\d|X|x)$)/.test(value)) {
    //     callback(new Error("你输入的身份证长度或格式错误"));
    //   }
    //   // 身份证城市
    //   var aCity = {
    //     11: "北京",
    //     12: "天津",
    //     13: "河北",
    //     14: "山西",
    //     15: "内蒙古",
    //     21: "辽宁",
    //     22: "吉林",
    //     23: "黑龙江",
    //     31: "上海",
    //     32: "江苏",
    //     33: "浙江",
    //     34: "安徽",
    //     35: "福建",
    //     36: "江西",
    //     37: "山东",
    //     41: "河南",
    //     42: "湖北",
    //     43: "湖南",
    //     44: "广东",
    //     45: "广西",
    //     46: "海南",
    //     50: "重庆",
    //     51: "四川",
    //     52: "贵州",
    //     53: "云南",
    //     54: "西藏",
    //     61: "陕西",
    //     62: "甘肃",
    //     63: "青海",
    //     64: "宁夏",
    //     65: "新疆",
    //     71: "台湾",
    //     81: "香港",
    //     82: "澳门",
    //     91: "国外"
    //   };
    //   if (!aCity[parseInt(value.substr(0, 2))]) {
    //     callback(new Error("你的身份证地区错误"));
    //   }
    //   // 出生日期验证
    //   var sBirthday = (
    //     parseInt(value.substr(6, 4)) +
    //     "-" +
    //     Number(value.substr(10, 2)) +
    //     "-" +
    //     Number(value.substr(12, 2))
    //   ).replace(/-/g, "/");
    //   var d = new Date(sBirthday);
    //   if (
    //     sBirthday !==
    //     d.getFullYear() + "/" + (d.getMonth() + 1) + "/" + d.getDate()
    //   ) {
    //     callback(new Error("身份证上的出生日期错误"));
    //   }

    //   // 身份证号码校验
    //   var sum = 0;
    //   var weights = [7, 9, 10, 5, 8, 4, 2, 1, 6, 3, 7, 9, 10, 5, 8, 4, 2];
    //   var codes = "10X98765432";
    //   for (var i = 0; i < value.length - 1; i++) {
    //     sum += value[i] * weights[i];
    //   }
    //   var last = codes[sum % 11]; // 计算出来的最后一位身份证号码
    //   if (value[value.length - 1] !== last) {
    //     callback(new Error("你输入的身份证号错误"));
    //   }
    //   callback();
    // };
    var checkIdentitytionId = (rule, value, callback) => {
      const reg = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/;
      if (value === "" || value === undefined || value === null) {
        callback();
      } else {
        if (!reg.test(value) && value !== "") {
          callback(new Error("请输入正确的身份证号码"));
        } else {
          callback();
        }
      }
    };
    // const checkPhoneNum = (rule, value, callback) => {
    //   let pattern = /^((0\d{2,3}-\d{7,8})|(1[3456789]\d{9}))$/;
    //   if (value !== "") {
    //     if (!pattern.test(value)) {
    //       callback(new Error("请输入正确的电话号码,其中座机号以“-”分隔"));
    //     }
    //   } else {
    //     callback();
    //   }
    // };
    return {
      formConfig: [
        {
          label: '承租户姓名',
          prop: 'lesseeName',
          type: 'input',
        }
      ],
      searchlist: {},
      value: "",
      idCard: {},
      // 承租户姓名
      lesseeName: undefined,
      // 图片路径
      endsTime: "",
      nowGroupId: "",
      nowfacilityId: "",
      idCardInImgUrl: "",
      idCardOutImgUrl: "",
      nowPlantingTypeId: "",
      contractPictureList: [],
      // 选中的数据项数组 ID组成
      relList: [],
      options: [],
      // 设施组数组
      tagsList: [],
      // 身份证
      idCardList: [],
      // 种养品种
      varietyArr: [],
      // 所有设施数组
      facilityArr: [],
      lesseeNoList: [],
      // 用户名称
      staffData: [],
      // 设施数组
      facilityList: [],
      plantingTypeList: [],
      organizationList: [],
      currentRow: null,
      startDatePicker: this.beginDate(),
      endDatePicker: this.processDate(),
      formData: {
        lesseeName: null,
        idCardId: null,
        phoneNumber: null,
        numberLeasePlots: null,
        totalRentedArea: null,
        unitName: "亩"
      },
      rules: {
        lesseeName: [
          { required: true, message: "请输入承租户名称", trigger: "blur" },
          { min: 1, max: 5, message: "长度在 1 到 5 个字符", trigger: "blur" }
        ],
        identificationNumber: [
          { required: true, message: "请输入身份证", trigger: "blur" },
          { validator: checkIdentitytionId, trigger: "blur" }
        ],
        // phone: [
        //   { required: true, message: "请输入手机号", trigger: "blur" },
        //   {
        //     validator: checkPhoneNum,
        //     trigger: "blur"
        //   }
        // ],
        leasedPlotsCount: [
          { required: true, message: "请输入承租地块数", trigger: "blur" }
        ],
        leasedPlotsTotalArea: [
          { required: true, message: "请输入承租总面积", trigger: "blur" }
        ]
        // unitName: [{ required: true, message: "请选择单位", trigger: "blur" }],
        // rent: [{ required: true, message: "请输入租金", trigger: "blur" }],
        // startTime: [
        //   { required: true, message: "请选择承租开始时间", trigger: "change" }
        // ],
        // endTime: [
        //   { required: true, message: "请选择承租结束时间", trigger: "change" }
        // ]
      }
    };
  },
  computed: {
    changeTime(time) {
      return this.$this.$moment(time).format("YYYY-MM-DD HH:mm:ss");
    },
    ...mapGetters({
      judgePermission: "permission/judgePermission"
    })
  },
  watch: {
    tableData: function() {
      this.$nextTick(function() {
        if (this.$route.query.id) {
          // console.log(this.$route.query.id)
          this.$refs.tableData.setCurrentRow(this.tableData[0]);
        }
      });
    },
    formData: {
      deep: true,
      handler(val) {
        // console.log(val)
        if (val.totalRentedArea && val.rent) {
          // 当input值改变时计算
          this.$set(
            val,
            "unitPrice",
            (parseFloat(val.rent) / parseFloat(val.totalRentedArea)).toFixed(2)
          );
        }
      }
    }
  },
  created() {
    this.getTableDataList();
  },
  mounted() {
    this.queryDataList();
  },
  methods: {
    // 查询表格数据
    getTableDataList() {
      this.loading = true;
      let params = {
        page: this.currentPage,
        size: this.pageSize,
        entity: {
          lesseeName: this.searchlist.lesseeName,
          // lesseeNo: this.$route.query.id,，
          organizationNo: sessionStorage.organizationNo,
          contactStatus: 1
        }
      };
      tenantInfoManage.getTenantInfoList(params).then(res => {
        // console.log(res);
        this.loading = false;
        let data = res.data;
        // console.log(data);
        if (data) {
          this.totalSize = data.totalElements;
          this.tableData = data.content;
          this.addblankmet();
          this.resetActionBar();
        }
      });
    },
    person(e) {
      // console.log(e)
      if (e.personNo) {
        this.$set(this.formData, "personNo", e.personNo);
        this.$set(this.formData, "lesseeName", e.person.name);
      } else {
        this.$set(this.formData, "personNo", undefined);
        this.$set(this.formData, "lesseeName", "");
      }
    },
    async queryDataList() {
      // const { data: topitem } = await baseQuery.baseQueryByCondition();
      // // 查询农资名称
      // let topitemidList = topitem.map((item) => item.farmingTypeNo);
      // // 批量查询所有种植列表
      // const { data: res } = await tenantInfoManage.getqueryOwnTreegCategory(
      //   topitemidList
      // );
      // this.varietyArr = res;
      // // 查询组织结构Id
      // const { data: resp } = await tenantInfoManage.queryOrganizationlist();
      // this.organizationList = resp;
      // // 批量设施组信息
      // const { data: resa } = await tenantInfoManage.queryfacility();
      // this.options = resa;
      // // 员工
      const { data: staff } = await staffManage.getStaffListByCondition();
      // 赋值数组
      this.staffData = staff;
      // console.log(this.options);
    },
    getRowKey(row) {
      return row.lesseeNo;
    },
    addPoint() {
      if (!this.canInput) {
        return;
      } else {
        // 新增点的对象数据数组
        let arr = this.options.facilityGroupList.filter(
          item => item.facilityGroupId === this.nowGroupId
        );
        // 判断是否存在该巡查点 facilityGroupId组成新数组
        let idList = this.tagsList.map(item => item.facilityGroupId);
        if (idList.includes(arr[0].facilityGroupId)) {
          this.$message.error("该设施已经存在~");
          return;
        } else {
          this.tagsList = this.tagsList.concat(arr);
          // console.log(this.tagsList);
        }
      }
    },
    // 删除设施组
    removeTheTag(pointId) {
      if (this.canInput) {
        this.tagsList.forEach((item, index) => {
          if (item.facilityGroupId === pointId) {
            this.tagsList.splice(index, 1);
          }
        });
      } else {
        this.$message.error("点击修改按钮后可删除~");
      }
    },
    // 添加设施
    addfacility() {
      if (!this.canInput) {
        return;
      } else {
        // 新增点的对象数据数组
        let arr = this.options.facilityList.filter(
          item => item.facilityNo === this.nowfacilityId
        );
        // 判断是否存在该巡查点 facilityGroupId组成新数组
        let idList = this.facilityList.map(item => item.facilityNo);
        if (idList.includes(arr[0].facilityNo)) {
          this.$message.error("该设施已经存在~");
          return;
        } else {
          this.facilityList = this.facilityList.concat(arr);
          // console.log(this.facilityList);
        }
      }
    },
    // 删除设施
    removeFacilityTag(pointId) {
      if (this.canInput) {
        this.facilityList.forEach((item, index) => {
          if (item.facilityNo === pointId) {
            this.facilityList.splice(index, 1);
          }
        });
      } else {
        this.$message.error("点击修改按钮后可删除~");
      }
    },
    addPlanting() {
      if (!this.canInput) {
        return;
      } else {
        // 新增点的对象数据数组
        let arr = this.varietyArr.filter(
          item => item.plantingTypeNo === this.nowPlantingTypeId
        );
        // 判断是否存在该巡查点 facilityGroupId组成新数组
        let idList = this.plantingTypeList.map(item => item.plantingTypeNo);
        if (idList.includes(arr[0].plantingTypeNo)) {
          this.$message.error("该设施已经存在~");
          return;
        } else {
          this.plantingTypeList = this.plantingTypeList.concat(arr);
          // console.log(this.facilityList);
        }
      }
    },
    removePlantingTag(pointId) {
      if (this.canInput) {
        this.plantingTypeList.forEach((item, index) => {
          if (item.plantingTypeNo === pointId) {
            this.plantingTypeList.splice(index, 1);
          }
        });
      } else {
        this.$message.error("点击修改按钮后可删除~");
      }
    },
    changenowGroupId(val) {
      this.nowGroupId = val;
    },
    changenowfacilityId(val) {
      this.nowfacilityId = val;
    },
    changenowPlantingTypeId(val) {
      this.nowPlantingTypeId = val;
    },
    idCardInImg(e) {
      // console.log(e);
      let that = this;
      that.idCard["positive"] = e;
    },
    idCardInImgName(e) {
      let that = this;
      that.idCard["pictureName"] = e;
    },
    idCardOutImg(e) {
      // console.log(e);
      let that = this;
      that.idCard["nagativeSide"] = e;
      // console.log(that.idCard);
    },
    idCardOutImgName(e) {
      // console.log(e);
      this.pictureNames = e;
    },
    contractImg(e) {
      this.contractPictureList = e;
    },
    // 时间转换
    dateFormat(row, colnum) {
      if (row.endTime) {
        return this.$moment(row[colnum.property]).format(
          "YYYY年MM月DD日 HH:mm:ss"
        );
      }
    },
    // 限制前面日期不能低于后面日期
    beginDate() {
      const self = this;
      return {
        disabledDate(time) {
          if (self.formData.endTime) {
            //  如果结束时间不为空，则小于结束时间
            return new Date(self.formData.endTime).getTime() < time.getTime();
          } else {
            // return time.getTime() > Date.now()//开始时间不选时，结束时间最大值小于等于当天
          }
        }
      };
    },
    processDate() {
      const self = this;
      // if (self.endTime) {
      return {
        disabledDate(time) {
          if (self.formData.startTime) {
            //  如果开始时间不为空，则结束时间大于开始时间
            self.time = new Date();
            return new Date(self.formData.startTime).getTime() > time.getTime();
          } else {
            return time.getTime() > Date.now(); // 开始时间不选时，结束时间最大值小于等于当天
          }
        }
      };
    },
    // 分页方法
    search() {
      this.currentPage = 1;
      if (this.searchlist.lesseeName === "") {
        this.$route.query.id = "";
      }
      this.getTableDataList();
    },
    changePageSize(pageSize) {
      this.pageSize = pageSize;
      this.getTableDataList();
    },
    changeCurrentPage(currentPage) {
      this.currentPage = currentPage;
      this.getTableDataList();
    },
    handleEdit(row) {
      // if (this.$route.query.id) {
      //   return;
      // }
      console.log(row.lesseeNo);
      if (!row.lesseeNo) {
        return;
      }

      this.editActive = true;
      this.saveActive = false;
      this.cancelActive = true;
      this.canInput = false;
      this.formData = {
        ...row,
        ...row.person
      };
      this.$set(
        this.List,
        "identificationNumber",
        desensitizedIdNo(row.person.identificationNumber)
      );
      this.$set(this.List, "phone", desensitizedPhone(row.person.phone));
    },
    handleSelectionChange(list) {
      this.lesseeNoList = [];
      this.lesseeNoList = list.map(item => item.lesseeNo);
      // if (this.lesseeNoList.length > 1) {
      //   this.$message.warning("承租户不可多选删除！");
      //   this.lesseeNoList.splice(0, this.lesseeNoList.length - 1);
      // }
      if (this.lesseeNoList.length > 0) this.delActive = true;
      else this.delActive = false;
      // 多个处理为单个数据
    },
    delmessage() {
      tenantInfoManage.dellistTenantInfo(this.lesseeNoList).then(res => {
        if (res.code === 1) {
          this.$message.success(res.msg);
          this.getTableDataList();
          this.lesseeNoList = [];
        } else {
          this.$message.warning(res.msg || "删除失败");
        }
      });
    },
    handleDelete(val) {
      // tenantInfoManage.delTenantInfo(val).then(res => {
      //   if (res.code === 1) {
      //     this.$message.success(res.msg);
      //     this.getTableDataList();
      //   } else {
      //     this.$message.warning(res.msg || "删除失败");
      //   }
      // });
      // this.selectedStaffList.splice(0, this.selectedStaffList.length - 1);
      this.$confirm("此操作将永久删除该条数据, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
        customClass: "myClass"
      })
        .then(() => {
          tenantInfoManage.delTenantInfo(val).then(res => {
            if (res.code === 1) {
              this.$message.success(res.msg);
              this.getTableDataList();
            } else {
              this.$message.warning(res.msg || "删除失败");
            }
          });
        })
        .catch(() => {
          this.$message("取消删除");
        });
    },
    save(formData) {
      this.$refs[formData].validate(valid => {
        if (valid) {
          if (this.nowChanceStau === "edit") {
            let person = {
              ...this.formData,
              name: this.formData.lesseeName,
              organizationNo: sessionStorage.organizationNo
            };
            if (person.person) {
              delete person.person;
            }
            let formData = {
              person: person,
              // ...this.formData,
              lesseeName: person.lesseeName,
              lesseeNo: person.lesseeNo,
              leasedPlotsCount: person.leasedPlotsCount,
              leasedPlotsTotalArea: person.leasedPlotsTotalArea,
              mainPlantVariety: person.mainPlantVariety,
              organizationNo: sessionStorage.organizationNo,
              status: 1
            };
            tenantInfoManage.editTenantInfo(formData).then(res => {
              if (res.code === 1) {
                this.$message.success(res.msg || "修改成功！");
                this.getTableDataList();
              } else {
                this.$message.error(res.msg || "修改失败!");
              }
            });
          } else if (this.nowChanceStau === "add") {
            let formData = {};
            let person = {};
            if (!this.formData.personNo) {
              person = {
                ...this.formData,
                name: this.formData.lesseeName,
                organizationNo: sessionStorage.organizationNo
              };
              formData = {
                person: person,
                // ...this.formData,
                lesseeName: person.lesseeName,
                leasedPlotsCount: person.leasedPlotsCount,
                leasedPlotsTotalArea: person.leasedPlotsTotalArea,
                mainPlantVariety: person.mainPlantVariety,
                organizationNo: sessionStorage.organizationNo,
                status: 1
              };
            } else {
              formData = {
                ...this.formData,
                organizationNo: sessionStorage.organizationNo,
                status: 1
              };
            }
            // console.log(this.formData)
            tenantInfoManage.addPictureInfo(formData).then(res => {
              // console.log(res);
              if (res.code === 1) {
                this.$message.success(res.msg || "新增成功！");
                this.getTableDataList();
              } else {
                this.$message.error(res.msg || "新增失败!");
              }
            });
          }
        } else {
          // console.log('error submit!!');
          return false;
        }
      });
    },

    // 脱敏 start
    formatter(e) {
      // console.log(typeof e.person.phone)
      if (e.person && e.person.phone) {
        return desensitizedPhone(e.person.phone);
      }
    },
    // 脱敏-将数据从List对象保存到用于存储的tuomin对象中
    tuominSave(type) {
      switch (type) {
        case "name":
          this.formData.clientName = this.List.clientName;
          break;
        case "identificationNumber":
          // this.formData.identificationNumber = this.List.identificationNumber
          this.$set(
            this.formData,
            "identificationNumber",
            this.List.identificationNumber
          );
          break;
        case "phone":
          this.$set(this.formData, "phone", this.List.phone);
          // this.formData.clientPhone = this.List.clientPhone
          break;
      }
    },
    // 脱敏-将用于展示的input里的数据转化成脱敏
    tuominChange(type) {
      switch (type) {
        case "name":
          this.List.clientName = this.setName2(
            this.List.clientName ? this.List.clientName : ""
          );
          break;
        case "identificationNumber":
          this.List.identificationNumber = desensitizedIdNo(
            this.List.identificationNumber ? this.List.identificationNumber : ""
          );
          break;
        case "phone":
          this.List.clientPhone = this.setTel(
            this.List.clientPhone ? this.List.clientPhone : ""
          );
          break;
      }
    },
    // 脱敏-修改时触发焦点，将清空里面的值，方便重新填写
    tuominFocus(type) {
      // if (this.statusDialog === 2) { // 处于修改状态
      //   switch (type) {
      //     case "name":
      //       this.List.clientName = ''
      //       console.log("清除name")
      //       break;
      //     case "identificationNumber":
      //       this.List.identificationNumber = ''
      //       console.log("清除cert")
      //       break;
      //     case "phone":
      //       this.List.clientPhone = ''
      //       console.log("清除phone")
      //       break;
      //   }
      // } else {
      // console.log(this.List)
      // console.log(this.formData)
      // }
    }

    // 脱敏 end
  }
};
</script>

<style scoped lang="scss">
@import "~@/styles/variables.scss";

::v-deep .label {
  text-align: end;
  padding: 0 10px;
}
::v-deep .el-form-item__label {
  min-width: 120px !important;
  text-align: end;
}
.totalRentedArea {
  i {
    font-size: 30px;
    margin-left: 10px;
    cursor: pointer;
  }
  ::v-deep .el-input-group__append {
    background-color: #00a1c200;
    padding: 0 0 0 10px !important;
    border: 0px solid #6ecae3;
    .el-form-item {
      display: flex;
      // width: 20% !important;
      .el-form-item__label {
        width: 20% !important;
        min-width: 50px !important;
      }
      .el-form-item__content {
        margin: 0 !important;
        // width: 60% !important;
        .el-select--medium {
          border: 1px solid #6ecae3;
          border-radius: 5px;
          width: 100px !important;
          margin: 0 !important;
          color: #ffffff;
        }
        .el-select .el-input.is-disabled .el-input__inner:hover {
          border: none !important;
        }
      }
    }
  }
}
.rent {
  ::v-deep .el-input-group__append {
    color: #ffffff;
    // font-weight: 600;
    background-color: #00a1c200;
    border: none;
    padding: 0 20px !important;
  }
}
.noClick {
  cursor: not-allowed;
}
.df {
  display: flex;
  align-items: center;
  width: 100%;
}
.dfs {
  ::v-deep .el-form-item__content {
    flex-direction: column;
  }
}
.tags {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  .tag-item {
    height: 30px;
    padding: 5px 10px;
    background-color: #00a1c2;
    border-radius: 8px;
    display: flex;
    align-items: center;
    margin-top: 10px;
    margin-right: 10px;
    i {
      font-size: 14px;
    }
  }
}
</style>
